<template>
	<div class="admin-reward-modules">
		<div class="modules-search">
			<div class="modules-search_martio">
				<div class="modules-search_text">模式超市</div>
				<div class="modules-search_top">
					<div class="modules-search_box">
						<i class="el-icon-search"></i>
						<el-input placeholder="请输入维度名称，简介，维度Id等" v-model="searchValue" @input="search"></el-input>
					</div>
					<div class="modules-search_but" @click="search">搜索</div>
				</div>
			</div>
		</div>
		<div v-loading="isLoading">
			<div class="reward-modules_ul" v-if="widgetModel.length!=0">
				<div class="reward-modules_li" v-for="(item,index) in widgetModel" :key="index">
					<div class="reward-modules_box">
						<div class="modules_box-conter">
							<div class="modules_li-left">
								<router-link :to="'/Admin/RewardRule/Edit?moduleId='+item.id" class="modules-title" :title="item.name">{{item.name}}</router-link>
								<router-link :to="'/Admin/RewardRule/Edit?moduleId='+item.id" class="modules-intro" :title="item.intro">{{item.intro}}</router-link>
							</div>
							<div class="modules_li-right">
								<i :class="item.icon"></i>
							</div>
						</div>
						<div class="modules_li-but">
							<router-link :to="'/Admin/RewardRule/Edit?moduleId='+item.id" class="modules-buttom"><i class="el-icon-edit-outline"></i>新增</router-link>
							<router-link :to="'/Admin/RewardRule/List?moduleId='+item.id" class="modules-buttom"><i class="el-icon-menu"></i>管理</router-link>
							<router-link :to="'/Admin/RewardRecord/List?moduleId='+item.id" class="modules-buttom"><i class="el-icon-tickets"></i>记录</router-link>
							<router-link :to="'/Admin/Reward/List?moduleId='+item.id" class="modules-buttom"><i class="el-icon-folder-opened"></i>数据</router-link>
						</div>
					</div>
				</div>
			</div>
			<zk-nodata v-else></zk-nodata>
		</div>
	</div>
</template>

<script>
	import './var.scss'
	import iconJson from './icon.json'
	import ala from 'ala'
	export default {
		data() {
			return {
				widgetModel: [],
				searchValue: '',
				isLoading: true,
				arrayList: [],
				widgetValue: [],
				searchModel: null
			}
		},
		props: {
			widget: {}
		},
		mounted() {
			this.init()
		},
		methods: {
			async init() {
				var reponen = await this.$ala.httpGet('api/RewardRule/Modules')
				this.arrayList = reponen.shareModules
				if (this.widget.value) {
					if (this.widget.value.ids) {
						this.widgetValue = this.widget.value.ids
					} else {
						this.widgetValue = []
					}
				}
				this.widgetModel = this.arrayWeight(this.arrayList, this.widgetValue)
				this.searchModel = this.arrayWeight(this.arrayList, this.widgetValue)
				for (let i in this.widgetModel) {
					this.widgetModel[i].icon = iconJson[i]
					this.searchModel[i].icon = iconJson[i]
				}
				this.isLoading = false
			},
			async search() {
				var arr = []
				if (this.searchValue) {
					this.searchModel.forEach((res) => {
						if (res.name.indexOf(this.searchValue) > -1 || res.id.indexOf(this.searchValue) > -1 || res.intro.indexOf(this.searchValue) > -1) {
							arr.push(res)
						}
					})
				} else {
					arr = this.arrayWeight(this.arrayList, this.widgetValue)
				}
				this.widgetModel = arr
			},
			arrayWeight(val, data) {
				var arr = val.filter(item => {
					var arr1 = data.map(v => v)
					return !arr1.includes(item.id)
				})
				return arr
			}
		}
	}
</script>